﻿{% extends "base_cn.html" %}
{% block title %} -- 用户信息设置 {% endblock %}
{% block content %}


<script type="text/javascript" src="static/gears_init.js"></script>
<script type="text/javascript" src="http://www.google.cn/jsapi?key=ABQIAAAASxuhjqc-j0-xBqPZInKKfhToNW08s6aZzsYvqCmYymrddPgvJxSFfjpuxixLl2WrMuudrwyqAsajsg"></script>
<!--script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAASxuhjqc-j0-xBqPZInKKfhToNW08s6aZzsYvqCmYymrddPgvJxSFfjpuxixLl2WrMuudrwyqAsajsg"></script-->

<script type="text/javascript"> 
//    google.load("maps", "2"); 
    google.load("maps", "2", {"base_domain": "ditu.google.cn"}); 

    var geocoder = null;
    var map = null;

    var lat = null;
    var lon = null;
    var old_overlay = null;


{% if UserInfo.Latitude %}
    lat = {{ UserInfo.Latitude }};
{% endif %}

{% if UserInfo.Longitude %}
    lon = {{ UserInfo.Longitude }};
{% endif %}

    function handleError(positionError)
    {
	alert('获取本地坐标失败: ' + positionError.message);
    }

    function SetLocalPosition(position)
    {
	SetMapToLatAndLon(position.latitude, position.longitude);
    }

    function SetMapToLatAndLon(SetLat, SetLon)
    {
	lat = SetLat;
	lon = SetLon;

	if(null == map)
	{
	    map = new google.maps.Map2(document.getElementById("map_canvas"));
	    map.addControl(new GLargeMapControl());
	    map.addControl(new GMapTypeControl());
	}

	var current_location = new GLatLng(SetLat, SetLon);
	//alert('current_location = ' + current_location);

	map.setCenter(current_location, 13); 

	var marker = new GMarker(current_location, {title:'我的位置'});
	if(null != old_overlay)
	{
	    //alert(old_overlay);
	    map.removeOverlay(old_overlay);
	}

	map.addOverlay(marker);
	old_overlay = marker;
	//alert(old_overlay);

	if(null == geocoder)
	{
	    geocoder = new GClientGeocoder();
	}
	geocoder.getLocations(current_location, ShowAddressAtPage);
    }

    function ShowAddressAtPage(response)
    {
	if(response && response.Status.code == 200)
	{
	    place = response.Placemark[0];
	    document.getElementById("human_readable").innerHTML = place.address;
	    document.getElementById("Address").value = place.address;
	}
    }

    function initialize()
    { 
	if(null == lat)
	{
	    var geo = google.gears.factory.create('beta.geolocation');
	    geo.getCurrentPosition(SetLocalPosition, handleError);
	}
	else
	{
	    SetMapToLatAndLon(lat, lon);
	}
    }


    function OnGetLatAndLogFromAddressName(point)
    {
	if(!point)
	{
	    alert('Bad Address');
	    return;
	}

	SetMapToLatAndLon(point.lat(), point.lng());
    }

    function UpdateUserLocation(form)
    {
	if(geocoder)
	{
	    var loc = geocoder.getLatLng(form.NewAddress.value, OnGetLatAndLogFromAddressName);
	}
    }

    function AutoGetLocation(form)
    {
	 var geo = google.gears.factory.create('beta.geolocation');
	 geo.getCurrentPosition(SetLocalPosition, handleError);
    }
 
    google.setOnLoadCallback(initialize);

</script>



<script type="text/javascript" src="/static/json2.js"></script>
<script type="text/javascript">
	//
	// As mentioned at http://en.wikipedia.org/wiki/XMLHttpRequest
	//
	if( !window.XMLHttpRequest ) XMLHttpRequest = function()
	{
		try{ return new ActiveXObject("Msxml2.XMLHTTP.6.0") }catch(e){}
		try{ return new ActiveXObject("Msxml2.XMLHTTP.3.0") }catch(e){}
		try{ return new ActiveXObject("Msxml2.XMLHTTP") }catch(e){}
		try{ return new ActiveXObject("Microsoft.XMLHTTP") }catch(e){}
		throw new Error("Could not find an XMLHttpRequest alternative.");
	};

	function OnCheckFinish(response)
	{
	    if(1 == Number(response))
	    {
		alert('该昵称已存在，请重新设置一个昵称');
		document.getElementById('NickName').focus();
	    }
	}

	function OnCheckNickName()
	{
	    var InputStr = document.getElementById('NickName').value;
	    if(0 < InputStr.length)
	    {
//		alert(InputStr);
		var req = new XMLHttpRequest();
		req.open('GET', '/user_check_rpc?nickname=' + encodeURIComponent(InputStr), true);

		req.onreadystatechange = function()
		{
			if(req.readyState == 4 && req.status == 200)
			{
			    var response = null;
			    try
			    {
				response = JSON.parse(req.responseText);
			    }
			    catch (e)
			    {
				response = req.responseText;
			    }

			    OnCheckFinish(response);
			}
		}
		
		req.send(null);
	    }
	}

	function OnSubmit()
	{
	    document.getElementById("Latitude").value = lat;
	    document.getElementById("Longitude").value = lon;
	    document.getElementById("form-userinfo").submit();
	}

</script>



<form action="/userinfo" method="post" name="form-userinfo" id="form-userinfo" enctype="multipart/form-data">
  <table borderColor=#cccccc cellSpacing=0 cellPadding=3 width="100%" bgColor=#ffffff border=2>

    <tr>
	<td>&nbsp;头像：</td>
	<td>
		{% if UserInfo.HavePhoto %}
			<img src = "/userphoto?item={{ UserInfo.LoginID }}" width="80px" height="80px" style = "float:left;">
		{% else %}
			<img src = "/images/defaultphoto.jpg" width="80px" height="80px" style = "float:left;">
		{% endif %}


		<input type="file" name="Photo" id="Photo" size="58"/>
	</td>
    </tr>

    <tr>
	<td>&nbsp;昵称：</td>
	<td>{{ UserInfo.LoginAccount.nickname }}<!--input type="text" name="NickName" id="NickName" value="{{ UserInfo.LoginAccount.nickname }}" onblur="OnCheckNickName()"--></td>
    </tr>

    <tr>
	<td>&nbsp;性别：</td>
	<td>
		<input type="radio" name="Gender" value="0" {% ifequal UserInfo.Gender 0 %}checked{% endifequal %}>保密
		<input type="radio" name="Gender" value="1" {% ifequal UserInfo.Gender 1 %}checked{% endifequal %}>男
		<input type="radio" name="Gender" value="2" {% ifequal UserInfo.Gender 2 %}checked{% endifequal %}>女
	</td>
    </tr>

    <tr>
	<td>&nbsp;国家：</td>
	<td><input type="text" name="Country" value="{{ UserInfo.Country }}" ></input></td>
    </tr>

    <tr>
	<td>&nbsp;我的位置：</td>
	<td>
	        <input type="hidden" id="Latitude" name="Latitude"/>
        	<input type="hidden" id="Longitude" name="Longitude"/>
	        <input type="hidden" id="Address" name="Address">

		<div id="map_canvas" style="width: 500px; height: 300px"></div>
		<div id="human_readable"></div>

	        输入其他地址: <input type="text" id="NewAddress" name="NewAddress">
	        <input type="button" value="更改我的位置" onclick="UpdateUserLocation(this.form)">
	        <input type="button" value="自动获取当前位置" onclick="AutoGetLocation(this.form)">
	</td>
    </tr>

    <tr>
	<td>&nbsp;允许别人加为好友：</td>
	<td>
		<input type="radio" name="AllowFriend" value="0" {% ifequal UserInfo.AllowFriend 0 %}checked{% endifequal %} />允许
		<input type="radio" name="AllowFriend" value="1" {% ifequal UserInfo.AllowFriend 1 %}checked{% endifequal %} />需要我同意
		<input type="radio" name="AllowFriend" value="2" {% ifequal UserInfo.AllowFriend 2 %}checked{% endifequal %} />不允许
	</td>
    </tr>
    <tr>
	<td>&nbsp;个人信息公开：</td>
	<td>
		<input type="radio" name="PublicType" value="0" {% ifequal UserInfo.PublicType 0 %}checked{% endifequal %}>公开
		<input type="radio" name="PublicType" value="1" {% ifequal UserInfo.PublicType 1 %}checked{% endifequal %}>仅向朋友公开
		<input type="radio" name="PublicType" value="2" {% ifequal UserInfo.PublicType 2 %}checked{% endifequal %}>不公开
	</td>
    </tr>

    <tr>
	<td></td>
	<td><input type="button" value="提交" onclick="OnSubmit()"/></td>
    </tr>

  </table>

</form>

{% endblock %}